 window.onload=function(){
 var MovePicture=document.getElementById('MovePicture'),
 Picture=document.getElementById('Picture').getElementsByTagName("li"),
 Nums=document.getElementById('Nums').getElementsByTagName('li'),
 index=0,
 play=null;
 
 // 定义并调用自动播放函数
 play = setInterval(autoPlay, 2000);
 
 // 鼠标划过整个容器时停止自动播放
 MovePicture.onmouseover = function () {
 clearInterval(play);
 }
 
 // 鼠标离开整个容器时继续播放至下一张
 MovePicture.onmouseout = function () {
 play = setInterval(autoPlay, 2000);
 }
 // 遍历所有数字导航实现划过切换至对应的图片
 for (var i = 0; i < Nums.length; i++) {
 Nums[i].onmouseover = function () {
 clearInterval(play);
 index = this.innerText - 1;
 changePic(index);
 };
 };
 
 function autoPlay () {
 if (++index >= Picture.length) index = 0;
 changePic(index);
 }
 
 // 定义图片切换函数
 function changePic (curIndex) {
 for (var i = 0; i < Picture.length; ++i) {
 Picture[i].style.display = "none";
 Nums[i].className = "";
 }
 Picture[curIndex].style.display = "block";
 Nums[curIndex].className = "on";
 }
 
 	var userbtn = document.getElementsByTagName('button');
	var divs=document.getElementById('divs').getElementsByTagName('div');
			for(var i=0;i<userbtn.length;i++){
				userbtn[i].index=i;
				userbtn[i].onclick=function(){
					for(var j=0;j<userbtn.length;j++){
						userbtn[j].className="";
					}
					this.className = "reed";
				for(var i=0;i<divs.length;i++){
						divs[i].style.display="none";
					}
					divs[this.index].style.display="block";
				}
			}
 };

